<template>
  <div class="container" style="margin: 0px 10% 0px 18%">
    <div class="buttons">
      <b-button type="is-success" @click="search('知识')">知识</b-button>
      <b-button type="is-success is-light" @click="search('动画')"
        >动画</b-button
      >

      <b-button type="is-danger" @click="search('数码')">数码</b-button>
      <b-button type="is-danger is-light" @click="search('影视')"
        >影视</b-button
      >

      <b-button type="is-warning" @click="search('音乐')">音乐</b-button>
      <b-button type="is-warning is-light" @click="search('时尚')"
        >时尚</b-button
      >
      <b-button type="is-primary" @click="search('生活')">生活</b-button>
      <b-button type="is-primary is-light" @click="search('舞蹈')"
        >舞蹈</b-button
      >
      <b-button type="is-info" @click="search('娱乐')">娱乐</b-button>
      <b-button type="is-info is-light" @click="search('新闻')">新闻</b-button>

      <b-button type="is-link" @click="search('萌宠')">萌宠</b-button>
      <b-button type="is-link is-light" @click="search('游戏')">游戏</b-button
      ><br />
    </div>
  </div>
</template>
<script>
export default {
  name: "tag",
  data() {
    return {
      value: "",
    };
  },
  methods: {
    async search(str) {
      console.log(str);
      this.$router.push({
        path: "/search",
        query: {
          value: str,
          status: 0,
        },
      });
    },
  },
};
</script>
<style scoped>
</style>
